<template>
	<BothScrollArea
		class="pc_components_both-scroll-area_example1"
		@resize="resize"
		@inner-resize="innerResize">
		<div class="content">
			<p>这是一段测试内容这是一段测试内容这是一段测试内容!......</p>
			<p>这是一段测试内容这是一段测试内容这是一段测试内容!......</p>
			<p>这是一段测试内容这是一段测试内容这是一段测试内容!......</p>
			<p>这是一段测试内容这是一段测试内容这是一段测试内容!......</p>
			<p>这是一段测试内容这是一段测试内容这是一段测试内容!......</p>
			<p>这是一段测试内容这是一段测试内容这是一段测试内容!......</p>
			<p>这是一段测试内容这是一段测试内容这是一段测试内容!......</p>
			<p>这是一段测试内容这是一段测试内容这是一段测试内容!......</p>
			<p>这是一段测试内容这是一段测试内容这是一段测试内容!......</p>
			<p>这是一段测试内容这是一段测试内容这是一段测试内容!......</p>
			<p>这是一段测试内容这是一段测试内容这是一段测试内容!......</p>
			<p>这是一段测试内容这是一段测试内容这是一段测试内容!......</p>
		</div>
	</BothScrollArea>
</template>

<script>
import BothScrollArea from '@/components/pc/both-scroll-area';

export default {
	name:'example1',
	components:{
		BothScrollArea,
	},
	methods:{
		resize(data){
			console.log('resize',data);
		},
		innerResize(data){
			console.log('innerResize',data);
		},
	}
};
</script>

<style lang="scss">
.pc_components_both-scroll-area_example1{
	width:200px;
	height:150px;
	border:1px solid #000;
	.content{
		white-space:pre;
	}
}
</style>
